import React, { Component } from 'react';

import Header from '@c/navBar/NavHead'
import img12 from '@a/images/notice/12_06.png'

import {Container} from './StyleNoticeDetail'

class NoticeDetail extends Component {
    state={
        num: 0
    }

    hanldeCopyClick = () => {
          this.setState({
              num: this.state.num = 1
          })
    }

    hanldeDeleteClick = () => {
        
    }
    render() {
        let { state } = this.props.location
        return (
            <Container>
               <Header title = "通知详情" {...this.props}></Header>
               <div className="detail">
                    <p>{state.tzName}</p>
                    <p>{state.tzBody}</p>
                   <ul>
                        <li><i>发件人</i><span>{state.fname}</span></li>
                        <li><i>发送时间</i><span>{state.tzDate}</span></li>
                        <li><i>来源</i><span>07-01群聊</span></li>
                        <li><i>通知来源</i><span><img src={img12} alt=""/> 签收类通知</span></li>
                   </ul>
               </div>
                <div className="detail12">
                    <h2>签收</h2>
                    <h3>
                        <div className="detail1">
                            <p>未签收人</p>
                            <ul>
                                {
                                    state.stus.map(a => {
                                        return <li key={a.sid} style={a.tzstatus === 1 ? { display: "block" } : { display: "none"}}>{ a.sname  }</li>                                        
                                    })
                                }
                            </ul>
                        </div>
                        <div className="detail2">
                            <p>已签收人</p>
                            <ul>
                                {
                                    state.stus.map(a => {
                                        return <li key={a.sid} style={a.tzstatus === 1 ? { display: "none" } : { display: "block" }}>{a.sname}</li>
                                    })
                                }
                            </ul>
                        </div>
                    </h3>
                </div>               
                <footer>
                    <p onClick={this.hanldeCopyClick}><i className="yo-ico">&#xe63c;</i> 复制
                     <u style={ this.state.num === 1 ? { display: "block" } : { display: "none" } }>复制成功！！！快去粘贴吧</u>
                    </p>
                    <p onClick={() => { this.props.history.push('/NoticeCommon', state) }}><i className="yo-ico">&#xe67d;</i>转发</p>
                    <p onClick={() => { this.props.history.push('/historyNotice') }}><i className="yo-ico">&#xe659;</i>删除</p> 
                </footer>
            </Container>
        );
    }
}

export default NoticeDetail;


